<template>
  <TagAdd
    :list="modelValue"
    @updateList="handleChanged"
  />
  <div
    v-for="item in modelValue"
    :key="item.id"
  >
    {{ item.message }}
  </div>
</template>

<script setup lang="ts">
import {defineOptions,ref,defineProps,watch,defineEmits} from 'vue'
import TagAdd from './tagAdd.vue'
defineOptions({ name: 'IFInput' });
const emit = defineEmits(['update:modelValue','customChange'])

const props = defineProps({
    modelValue:{
        type:Array,
        default:[]
    }
})
console.log('%c props','font-size:24px;color:red;',props)
const handleChanged = (val) => {
  // updateList
  emit('update:modelValue',val)
  emit('customChange',val)
}
</script>

<style scoped lang="scss">
// @import './index.scss';
</style>
